<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
<link rel="stylesheet" type="text/css" href="{f:uri.resource(path:'Css/style.css')}" />
<link rel="stylesheet" type="text/css" href="{f:uri.resource(path:'Css/zoom.css')}" />
<link rel="stylesheet" type="text/css" href="{f:uri.resource(path:'Css/jquery.bxslider.css')}" />
<script src="{f:uri.resource(path:'JavaScript/jquery.bxslider.js')}"></script>
<div class="col-md-8 xs-padding">
	<h3 class="c-title c-font-bold c-font-uppercase pull-left" style="margin-top: 0"><f:link.page pageUid="{settings.previewPid}" additionalParams="{uid : casecont1.uid}">{casetab.title}</f:link.page></h3>
	<f:if condition="{casetab.spare2}">
		<div class="text-center"><a class="pull-right albtn" href="{casetab.spare2}" target="_blank">访问案例网站</a></div>
	</f:if>
	<div style="clear: both;"></div>
	<div class="c-panel c-margin-b-30 clearfix">
		<!-- Baidu Button BEGIN -->
			<div class="bdsharebuttonbox" style="display: inline-block;float: left;"><a href="#" class="bds_more" data-cmd="more"></a><a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a><a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a><a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a><a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a><a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a></div>
			<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
		<span style="margin-left: 20px;position: relative;top: 3px;">浏览量：{casetab.hits}</span>
		<!-- Baidu Button END -->
	</div>
	<div class="pull-right datetime">
		发布时间：{casetab.datetime->f:format.date(format: 'Y-m-d h:i')}
	</div>
	<div style="clear: both;"></div>
	<div style="position: relative;top: 3px;">标签：
		<f:for each="{casetab.tagname}" as="tag">
			<f:link.action action="nylist" arguments="{industry:'',product:'',labels:tag.uid}" >{tag.name}&nbsp;&nbsp;</f:link.action>
		</f:for>
	</div>
	<div class="c-desc">
		<f:if condition="{casetab.content}">
			<f:format.html>{casetab.content}</f:format.html><br/>
		</f:if>
		<!-- <div style="margin-top: 10px;margin-bottom: 10px;" class="text-center"><f:image src="uploads/tx_casetab/{casetab.image}" style="height:auto;margin-left: auto;margin-right: auto;"/></div> -->
		<f:if condition='{settings.templateLayout}==4'>
			<style>
				.c-desc embed,iframe,video{
					height:500px;
					width:100%;
				}
				.new-content p{
					text-align: center;
				}
			</style>
		</f:if>
		<f:format.raw>{casetab.spare1}</f:format.raw>
		
		<script>
			var len = $("video").length;
			if(len>0){
				for(var i=0;i<len;i++){
					$("video").eq(i).removeAttr("preload");
					$("video").eq(i).width('100%');
					$("video").eq(i).height('100%');
				}
			}
		</script>
	</div>

<div class="text-center backbtn" style="margin-top: 20px;margin-bottom: 20px;">
	<f:link.page pageUid="{settings.previewPid}" class="btn btn-info">返回</f:link.page><br />
</div>
</div>
<div class="col-md-4 xs-padding">
	<div class="containers">
		<div class="gallery">
	    	<f:for each="{allImage}" as="vimg">
		        <div class="col-md-4 col-sm-12 img-col"><!-- <a href="uploads/tx_casetab/{vimg}"> -->
		        	<f:image src="uploads/tx_casetab/{vimg}" height="500c" class='imgZoom mdimg'></f:image><!-- </a> -->
		        	<f:image src="uploads/tx_casetab/{vimg}" width="500c" class='imgZoom smimg hide'></f:image>
		        </div>
		        <div class="hide" id="imgsrc" data-src="uploads/tx_casetab/{vimg}"></div>
		    </f:for>
	    </div>
	    <div class="clear"></div>
	</div>
	<div class="projectdetails">
		<div class="projectitem">
			<div class="projecttitle">应用场景：</div>
			<div class="projectcontent">{casetab.spare4}</div>
		</div>
		<div class="projectitem">
			<div class="projecttitle">应用效果：</div>
			<div class="projectcontent">{casetab.spare5}</div>
		</div>
		<div class="projectitem">
			<div class="projecttitle">技术要点：</div>
			<div class="projectcontent">{casetab.spare6}</div>
		</div>
	</div>
	<div class="text-center morecase"><f:link.page pageUid="{settings.previewPid}">查看更多案例>></f:link.page></div>
	<div id="jyintroduce"></div>
</div>
<div style="clear: both;"></div>
<f:if condition="{casetabs}">
	<div class="recommend">
		<h4>行业推荐</h4>
		<div class="bx-wrapper">
		    <div class="bx-viewport">
		        <div class="slider1">
		        	<f:for each="{casetabs}" as="cas">
			        	<div class="slide">
			            	<f:link.page pageUid="108" additionalParams="{uid : cas.uid}">
				                <f:image src="uploads/tx_casetab/{cas.allimage.0}" height="400c" width="500c"></f:image>
				            </f:link.page>
				            <div class="recommend-title"><f:link.page pageUid="108" additionalParams="{uid : cas.uid}">{cas.title}</f:link.page></div>
			            </div>
		        	</f:for>
		        </div>
		    </div>
		</div>
	</div>
	<!-- <script src="{f:uri.resource(path:'JavaScript/zoom.min.js')}"></script><div id="zoom" style="display: none;"><a class="close"></a><a href="http://www.jq22.com/demo/gurde-ZOOM-150305225539/#previous" class="previous"></a><a href="http://www.jq22.com/demo/gurde-ZOOM-150305225539/#next" class="next"></a><div class="content" style="width: 660px; height: 441px; margin-top: -220.5px; margin-left: -330px;"></div></div> -->
	<script src="{f:uri.resource(path:'JavaScript/jquery.mousewheel.js')}"></script>
	<script src="{f:uri.resource(path:'JavaScript/jquery.imgZoom.js')}"></script>
	<script src="{f:uri.resource(path:'JavaScript/jquery.drag.js')}"></script>
	<script>
		var width = window.screen.width;
		if(width<= 500){
			$(".backbtn").remove();
			$('.mdimg').addClass('hide').removeClass('show');
			$('.smimg').addClass('show').removeClass('hide');
		}
	
		$(document).ready(function(){
	      	$('.slider1').bxSlider({
	        	slideWidth: 200,
	        	minSlides: 2,
	        	maxSlides: 6,
	        	slideMargin: 20,
	        	pager:false
	      	});
	    });
	    /*$('.recommend .slide').mouseenter(function(event) {
	    	$(this).children('.recommend-title').css('display','block');
	    }).mouseleave(function(event) {
	    	$(this).children('.recommend-title').css('display','none');
	    });*/
	    if($(window).width()>500){
		    $(".imgZoom").imgZoom();
		}

		$('img').on('mousedown',function (e) {
		    e.preventDefault()
		})

	</script>

</f:if>
</html>